<template>
  <el-tree
    ref="biAuthTree"
    node-key="id"
    :data="treeData"
    :default-checked-keys="ids"
    v-bind="$attrs"
    :props="propConfig"
    show-checkbox
    :default-expand-all="true"
    @check-change="handleCheckChange"
  > </el-tree>
</template>

<script>
export default {
  name: 'AuthTree',
  props: {
    treeData: {
      type: Array,
      default: () => []
    },
    value: {
      type: Array,
      default: () => []
    }
  },

  data() {
    return {
      propConfig: {
        children: 'children',
        label: 'name'
      }
    }
  },
  computed: {
    ids: {
      get() {
        return this.value
      },
      set(value) {
        this.$emit('input', value)
      }
    }
  },
  methods: {
    handleCheckChange(data, checked, indeterminate) {
      this.ids = this.$refs.biAuthTree.getCheckedKeys()
    },

    handleNodeClick(data) {
      console.log(data)
    }
  }
}
</script>

<style>
</style>